<template lang="">
    <div>
    <!-- 展示商品 -->
            <table>
                <tr>
                    <td>id</td>
                    <td>名称</td>
                    <td>分类</td>
                </tr>
                <tr v-for='i in goods'>
                    <td>{{i.id}}</td>
                    <td>{{i.name}}</td>
                    <td>
                        <van-button @click='setcate(i.cid)'>{{i.cname}}</van-button>
                        </td>
                </tr>
                <tr>
                    <td>
                        <van-pagination
                            v-model="page"
                            :total-items="total"
                            :items-per-page="size"
                            @change='getGoods'
                            />
                    </td>
                </tr>
            </table>
        </div>
</template>

<script>
export default {
        data(){
            return{
                goods:[],
                size:2,
                total:0,
                page:1,
                cid:0
            }
        },
        methods: {
            //分页的形式获取商品信息
            getGoods(p){
                this.page = p
                this.$axios.get('goodsM?page='+p+'&size='+this.size+'&cid='+this.cid).then(res=>{
                    this.goods = res.data.list
                    this.total = res.data.total
                })
            },
            setcate(cid){
                this.cid=cid
                this.getGoods(1)
            }
        },
        mounted() {
            this.getGoods(1)
        },
}
</script>

<style lang=''>

</style>